<template>
    <footer>
        <span>&copy; 2023{{ year == 2023 ? '' : '-' + year }} 癸亥王</span>
        <span><a href="https://beian.miit.gov.cn/" target="_blank">{{ props.info.beian }}</a></span>
    </footer>
</template>

<script setup lang="ts">
import { ref, onMounted } from 'vue'
import useSystem from '@/store/useSystem'

const year = ref(2023)
const props = defineProps<{ info: SystemModel }>()
const system = useSystem()

onMounted(() => {
    year.value = new Date(system.time).getFullYear()
})
</script>

<style lang="scss" scoped>
footer {
    width: 100%;
    position: absolute;
    bottom: 0;
    padding: 20px;
    text-align: center;
    font-size: 12px;
    //background: var(--el-bg-color-page);
    color: var(--el-text-color-regular);
    border-top: 1px solid var(--el-border-color);

    span {
        margin-right: 8px;
    }

    a:hover {
        text-decoration: underline;
    }
}
</style>